import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:gameplay_flutter/lib_runtime/extension/string_extension/string_text.dart';
import 'package:gameplay_flutter/m_room/constants/room_assets.dart';
import 'package:gameplay_flutter/m_room/room_dialog/room_online_user.dart';
import 'package:ones/ui.dart';

class RoomMenber extends StatelessWidget {
  const RoomMenber({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.only(top: 8.0.h),
      child: Row(
        children: [
          _buildHeatWidget(),
          const Spacer(),
          _buildMenberListWidget(),
          _buildMenberCountWidget(context)
        ],
      ),
    );
  }

  /// 热度
  Widget _buildHeatWidget() {
    return Container(
        height: 26.75.h,
        padding: EdgeInsetsDirectional.only(start: 12.w, end: 14.w),
        decoration: BoxDecoration(
            color: const Color(0x0DFFFFFF),
            borderRadius: BorderRadiusDirectional.only(
                topEnd: Radius.circular(36.75.h / 2.0),
                bottomEnd: Radius.circular(36.75.h / 2.0))),
        child: Row(
            crossAxisAlignment: CrossAxisAlignment.center, // 添加这一行
            children: [
              const Icon(
                Icons.emoji_events, // 奖杯图标
                color: Colors.amber,
                size: 24,
              ),
              "999k".text(
                fontSize: 14.sp,
                color: const Color(0xFFFEB633),
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
                weight: TextFontWeight.medium,
              )
            ]));
  }

  /// 成员列表1~5
  Widget _buildMenberListWidget() {
    return Container(
      child: SingleChildScrollView(
        scrollDirection: Axis.horizontal,
        child: Row(
          children: List.generate(
            4, // 显示4个头像
            (index) => Container(
              margin: EdgeInsetsDirectional.only(end: 5.w),
              width: 26,
              height: 26,
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: [
                  Colors.pink[200],
                  Colors.purple[300],
                  Colors.amber,
                  Colors.blue[200],
                ][index],
              ),
            ),
          ),
        ),
      ),
    );
  }

  /// 打开成员列表
  Widget _buildMenberCountWidget(BuildContext context) {
    return Row(
      children: [
        Image.asset(RoomAssets.getMenberListArrow(context), width: 14.5.w, height: 14.5.h),
        Container(
          width: 31.w,
          height: 31.h,
          margin: EdgeInsetsDirectional.only(end: 15.w),
          padding: EdgeInsetsDirectional.only(top: 13.h),
          decoration: const BoxDecoration(
            image: DecorationImage(
              image: AssetImage(RoomAssets.roomPeopleNum),
              fit: BoxFit.cover,
            ),
          ),
          child: Center(
            child: "999".text(
              fontSize: 10.sp,
              color: const Color(0xFFFFFFFF),
              maxLines: 1,
              overflow: TextOverflow.ellipsis,
              weight: TextFontWeight.regular,
            ),
          ),
        ),
      ],
    ).onClick((){
      _showMenberListDialog(context);
    });
  }

  void _showMenberListDialog(BuildContext context) {
    showModalBottomSheet(
      context: context,
      backgroundColor: Colors.white,
      barrierColor: Colors.transparent,
      isScrollControlled: true,
      constraints: BoxConstraints(
        minHeight: MediaQuery.of(context).size.height * 0.7,
        maxHeight: MediaQuery.of(context).size.height * 0.7,
      ),
      builder: (BuildContext context) {
        return RoomOnlineUser();
      },
    );
  }

}
